.za-checkbox {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  color: var(--color-text);
  font-size: 14px;
}
.za-checkbox:not(.za-checkbox--disabled):hover .za-checkbox__inner {
  border-color: var(--checkbox-active-border-color);
}

.za-checkbox__widget {
  display: inline-block;
  vertical-align: middle;
}

.za-checkbox__input {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.za-checkbox__text {
  vertical-align: middle;
  margin: 0 8px;
}

.za-checkbox__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--checkbox-size);
  height: var(--checkbox-size);
  border: 1PX solid var(--checkbox-border-color);
  border-radius: var(--checkbox-radius);
  background: var(--checkbox-background);
  transition: all 0.2s cubic-bezier(0.71, -0.46, 0.88, 0.6);
}
.za-checkbox__inner:before {
  content: "";
  width: calc(var(--checkbox-size) / 3.5);
  height: calc(var(--checkbox-size) / 2);
  border: calc(var(--checkbox-size) / 9) solid var(--checkbox-arrow-color);
  border-top: 0;
  border-left: 0;
  margin-top: calc(var(--checkbox-size) / -12);
  margin-left: calc(var(--checkbox-size) / 18);
  transform: rotate(45deg) scale(0);
  transition: all 0.2s cubic-bezier(0.71, -0.46, 0.88, 0.6);
}

.za-checkbox--indeterminate .za-checkbox__inner:before {
  transform: rotate(0) scale(1);
  width: calc(var(--checkbox-size) / 2.33);
  height: calc(var(--checkbox-size) / 2.33);
  margin-top: 0;
  margin-left: 0;
  border: none;
  background-color: var(--theme-primary);
}

.za-checkbox--indeterminate.za-checkbox--disabled .za-checkbox__inner:before {
  transform: rotate(0) scale(1);
  background-color: var(--checkbox-disabled-color);
}

.za-checkbox--checked .za-checkbox__inner {
  border-color: var(--theme-primary);
  background-color: var(--theme-primary);
}
.za-checkbox--checked .za-checkbox__inner:before {
  transform: rotate(45deg) scale(1);
  transition: all 0.2s cubic-bezier(0.12, 0.4, 0.29, 1.46) 0.1s;
}

.za-checkbox--disabled .za-checkbox__input {
  cursor: not-allowed;
}

.za-checkbox--disabled .za-checkbox__text {
  color: var(--color-text-disabled);
}

.za-checkbox--disabled .za-checkbox__inner {
  background-color: var(--checkbox-disabled-background);
}

.za-checkbox--disabled.za-checkbox--checked .za-checkbox__inner {
  border-color: var(--checkbox-border-color);
  background-color: var(--checkbox-disabled-background);
}
.za-checkbox--disabled.za-checkbox--checked .za-checkbox__inner:before {
  border-color: var(--checkbox-disabled-color);
}

.za-checkbox--untext {
  line-height: 1;
}

.za-checkbox-group {
  display: inline-block;
  vertical-align: middle;
  overflow: hidden;
}
.za-checkbox-group__inner {
  margin-right: -24px;
  margin-bottom: -8px;
}

.za-checkbox-group .za-checkbox {
  margin-right: 24px;
  margin-bottom: 8px;
}
.za-checkbox-group--block {
  width: 100%;
}
.za-checkbox-group--block .za-checkbox-group__inner {
  display: flex;
  flex-wrap: wrap;
}

.za-checkbox-group--block .za-checkbox {
  flex: 1;
}

.za-checkbox-group--button .za-checkbox-group__inner {
  margin-right: -8px;
  margin-bottom: -8px;
}

.za-checkbox-group--button .za-checkbox {
  margin-right: 8px;
  margin-bottom: 8px;
  padding: 0;
  border: none;
  font-weight: normal;
  text-align: center;
  overflow: hidden;
  color: var(--color-text);
  outline: 0 none;
  user-select: none;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-appearance: none;
  /* disabled Button */
  /* block Button */
  border-width: 1PX;
  border-style: solid;
  border-radius: var(--radius-xs);
}
.za-checkbox-group--button .za-checkbox, .za-checkbox-group--button .za-checkbox:active, .za-checkbox-group--button .za-checkbox:hover, .za-checkbox-group--button .za-checkbox:focus, .za-checkbox-group--button .za-checkbox:visited {
  text-decoration: none;
}
.za-checkbox-group--button .za-checkbox.za-checkbox--disabled {
  cursor: not-allowed;
  opacity: var(--opacity-disabled);
}

.za-checkbox-group--button .za-checkbox.za-checkbox--block {
  display: block;
  width: 100%;
}

.za-checkbox-group--button .za-checkbox, .za-checkbox-group--button .za-checkbox:hover {
  background-color: var(--button-default-background);
  border-color: var(--button-default-border);
  color: var(--button-default-color);
}
.za-checkbox-group--button .za-checkbox:active {
  background-color: var(--button-default-background);
  border-color: var(--button-default-border);
  color: var(--button-default-color);
}
.za-checkbox-group--button .za-checkbox.za-checkbox--disabled {
  opacity: var(--button-disabled-opacity);
  cursor: not-allowed;
}
.za-checkbox-group--button .za-checkbox.za-checkbox--disabled:active, .za-checkbox-group--button .za-checkbox.za-checkbox--disabled:focus, .za-checkbox-group--button .za-checkbox.za-checkbox--disabled:visited {
  background-color: var(--button-default-background);
  border-color: var(--button-default-border);
  color: var(--button-default-color);
}

.za-checkbox-group--button .za-checkbox.za-checkbox--shadow {
  box-shadow: 0 3px 3px 0 var(--button-default-shadow-color);
}

.za-checkbox-group--button .za-checkbox.za-checkbox--loading .za-activity-indicator.za-activity-indicator--circular circle {
  stroke: var(--button-default-color);
}

.za-checkbox-group--button .za-checkbox .za-checkbox__text {
  margin: 0;
}

.za-checkbox-group--button .za-checkbox.za-checkbox--checked, .za-checkbox-group--button .za-checkbox.za-checkbox--checked:hover {
  background-color: var(--button-primary-background);
  border-color: var(--button-primary-border);
  color: var(--button-primary-color);
}
.za-checkbox-group--button .za-checkbox.za-checkbox--checked:active {
  background-color: var(--button-primary-active-background);
  border-color: var(--button-primary-active-border);
  color: var(--button-primary-active-color);
}
.za-checkbox-group--button .za-checkbox.za-checkbox--checked.za-checkbox--disabled {
  opacity: var(--button-disabled-opacity);
  cursor: not-allowed;
}
.za-checkbox-group--button .za-checkbox.za-checkbox--checked.za-checkbox--disabled:active, .za-checkbox-group--button .za-checkbox.za-checkbox--checked.za-checkbox--disabled:focus, .za-checkbox-group--button .za-checkbox.za-checkbox--checked.za-checkbox--disabled:visited {
  background-color: var(--button-primary-background);
  border-color: var(--button-primary-border);
  color: var(--button-primary-color);
}

.za-checkbox-group--button .za-checkbox.za-checkbox--checked.za-checkbox--shadow {
  box-shadow: 0 3px 3px 0 var(--button-primary-shadow-color);
}

.za-checkbox-group--button .za-checkbox.za-checkbox--checked.za-checkbox--loading .za-activity-indicator.za-activity-indicator--circular circle {
  stroke: var(--button-primary-color);
}

.za-checkbox-group--button.za-checkbox-group--block .za-checkbox {
  flex: 1;
}

.za-checkbox-group--button.za-checkbox-group--rect .za-checkbox {
  border-width: 1PX;
  border-style: solid;
  border-radius: 0;
}

.za-checkbox-group--button.za-checkbox-group--radius .za-checkbox {
  border-width: 1PX;
  border-style: solid;
  border-radius: var(--radius-md);
}

.za-checkbox-group--button.za-checkbox-group--round .za-checkbox {
  border-width: 1PX;
  border-style: solid;
  border-radius: var(--radius-round);
}

.za-checkbox-group--button.za-checkbox-group--circle .za-checkbox {
  border-width: 1PX;
  border-style: solid;
  border-radius: var(--radius-circle);
}

.za-checkbox-group--button.za-checkbox-group--lg .za-checkbox {
  padding: 0 var(--button-padding-h-lg);
  font-size: var(--button-font-size-lg);
  height: var(--button-height-lg);
  line-height: 1.5;
}
.za-checkbox-group--button.za-checkbox-group--lg .za-checkbox.za-checkbox--circle {
  width: var(--button-height-lg);
  padding: 0;
}

.za-checkbox-group--button.za-checkbox-group--lg .za-checkbox .za-icon {
  font-size: var(--button-icon-size-lg);
}
.za-checkbox-group--button.za-checkbox-group--lg .za-checkbox.za-checkbox--link {
  line-height: var(--button-height-lg);
}

.za-checkbox-group--button.za-checkbox-group--lg .za-checkbox.za-checkbox--loading .za-activity-indicator {
  width: var(--button-font-size-lg);
  height: var(--button-font-size-lg);
}

.za-checkbox-group--button.za-checkbox-group--lg .za-checkbox * + span {
  margin-left: calc(var(--button-padding-h-lg) / 2);
}

.za-checkbox-group--button.za-checkbox-group--md .za-checkbox {
  padding: 0 var(--button-padding-h-md);
  font-size: var(--button-font-size-md);
  height: var(--button-height-md);
  line-height: 1.5;
}
.za-checkbox-group--button.za-checkbox-group--md .za-checkbox.za-checkbox--circle {
  width: var(--button-height-md);
  padding: 0;
}

.za-checkbox-group--button.za-checkbox-group--md .za-checkbox .za-icon {
  font-size: var(--button-icon-size-md);
}
.za-checkbox-group--button.za-checkbox-group--md .za-checkbox.za-checkbox--link {
  line-height: var(--button-height-md);
}

.za-checkbox-group--button.za-checkbox-group--md .za-checkbox.za-checkbox--loading .za-activity-indicator {
  width: var(--button-font-size-md);
  height: var(--button-font-size-md);
}

.za-checkbox-group--button.za-checkbox-group--md .za-checkbox * + span {
  margin-left: calc(var(--button-padding-h-md) / 2);
}

.za-checkbox-group--button.za-checkbox-group--sm .za-checkbox {
  padding: 0 var(--button-padding-h-sm);
  font-size: var(--button-font-size-sm);
  height: var(--button-height-sm);
  line-height: 1.5;
}
.za-checkbox-group--button.za-checkbox-group--sm .za-checkbox.za-checkbox--circle {
  width: var(--button-height-sm);
  padding: 0;
}

.za-checkbox-group--button.za-checkbox-group--sm .za-checkbox .za-icon {
  font-size: var(--button-icon-size-sm);
}
.za-checkbox-group--button.za-checkbox-group--sm .za-checkbox.za-checkbox--link {
  line-height: var(--button-height-sm);
}

.za-checkbox-group--button.za-checkbox-group--sm .za-checkbox.za-checkbox--loading .za-activity-indicator {
  width: var(--button-font-size-sm);
  height: var(--button-font-size-sm);
}

.za-checkbox-group--button.za-checkbox-group--sm .za-checkbox * + span {
  margin-left: calc(var(--button-padding-h-sm) / 2);
}

.za-checkbox-group--button.za-checkbox-group--xs .za-checkbox {
  padding: 0 var(--button-padding-h-xs);
  font-size: var(--button-font-size-xs);
  height: var(--button-height-xs);
  line-height: 1.5;
}
.za-checkbox-group--button.za-checkbox-group--xs .za-checkbox.za-checkbox--circle {
  width: var(--button-height-xs);
  padding: 0;
}

.za-checkbox-group--button.za-checkbox-group--xs .za-checkbox .za-icon {
  font-size: var(--button-icon-size-xs);
}
.za-checkbox-group--button.za-checkbox-group--xs .za-checkbox.za-checkbox--link {
  line-height: var(--button-height-xs);
}

.za-checkbox-group--button.za-checkbox-group--xs .za-checkbox.za-checkbox--loading .za-activity-indicator {
  width: var(--button-font-size-xs);
  height: var(--button-font-size-xs);
}

.za-checkbox-group--button.za-checkbox-group--xs .za-checkbox * + span {
  margin-left: calc(var(--button-padding-h-xs) / 2);
}

.za-checkbox-group--button.za-checkbox-group--ghost .za-checkbox.za-checkbox--checked, .za-checkbox-group--button.za-checkbox-group--ghost .za-checkbox.za-checkbox--checked:hover {
  background-color: transparent;
  border-color: var(--theme-primary);
  color: var(--theme-primary);
}
.za-checkbox-group--button.za-checkbox-group--ghost .za-checkbox.za-checkbox--checked:active {
  background-color: transparent;
  border-color: var(--theme-primary);
  color: var(--theme-primary);
}
.za-checkbox-group--button.za-checkbox-group--ghost .za-checkbox.za-checkbox--checked.za-checkbox--disabled, .za-checkbox-group--button.za-checkbox-group--ghost .za-checkbox.za-checkbox--checked.za-checkbox--disabled:active, .za-checkbox-group--button.za-checkbox-group--ghost .za-checkbox.za-checkbox--checked.za-checkbox--disabled:hover, .za-checkbox-group--button.za-checkbox-group--ghost .za-checkbox.za-checkbox--checked.za-checkbox--disabled:focus, .za-checkbox-group--button.za-checkbox-group--ghost .za-checkbox.za-checkbox--checked.za-checkbox--disabled:visited {
  background-color: transparent;
  border-color: var(--theme-primary);
  color: var(--theme-primary);
  cursor: not-allowed;
}

.za-checkbox-group--button.za-checkbox-group--compact .za-checkbox:not(:last-child) {
  margin-right: -1PX;
}
.za-checkbox-group--button.za-checkbox-group--compact .za-checkbox:first-child {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.za-checkbox-group--button.za-checkbox-group--compact .za-checkbox:last-child {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.za-checkbox-group--button.za-checkbox-group--compact .za-checkbox:not(:first-child):not(:last-child) {
  border-radius: 0;
}
.za-checkbox-group--button.za-checkbox-group--compact .za-checkbox.za-checkbox--checked {
  z-index: 1;
}

.za-checkbox-group--cell {
  display: block;
  overflow: visible;
}
.za-checkbox-group--cell .za-checkbox-group__inner {
  margin-right: 0;
  margin-bottom: 0;
}

.za-checkbox-group--cell .za-checkbox {
  position: static;
  margin-right: 0;
  margin-bottom: 0;
}
